<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品详情</title>
    <meta name="keywords" content="#">
    <meta name="discription" content="#">
    <meta name="author" content="#">
    <link rel="shrotcut icon" href="logo.ico">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/pro_details.css">
    <script src="js/jquery-1.11.3.min.js"></script>
</head>
<body>
    <section>
        <article class="clearfix">
            <!--商品参数Parameter-->
            <div class="parameter">
                <h2>
                    <a href="index.html">首页</a>>
                    <a href="#">钻石</a>>
                    <a href="#">钻戒</a>>
                    <span>枕上-铂900钻石戒指</span>
                </h2>
                <!--左面是图片Picture-->
                <div class="picture">
                    <!--放大镜Magnifier-->
                    <div class="magnifier">
                        <img src="img/magnifier_1.png" alt="magnifier_1.png">
                        <span></span>
                    </div>
                    <!--缩略图列表list-->
                    <div class="list">
                        <!--轮播Carousel-->
                        <div class="carousel">
                            <ul class="clearfix">
                                <li class="current">
                                    <img src="img/magnifier_1.png" alt="magnifier_1.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_2.png" alt="magnifier_2.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_3.png" alt="magnifier_3.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_4.png" alt="magnifier_4.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_1.png" alt="magnifier_1.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_2.png" alt="magnifier_2.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_3.png" alt="magnifier_3.png">
                                </li>
                                <li>
                                    <img src="img/magnifier_4.png" alt="magnifier_4.png">
                                </li>
                            </ul>
                        </div>
                        <span class="left"></span>
                        <span class="right"></span>
                    </div>
                    <!--放大版的图片位置-->
                    <div class="big">
                        <img src="img/magnifier_1.png" alt="magnifier_1.png">
                    </div>
                </div>
                <!--右边是数据Data-->
                <div class="data"></div>
            </div>
            <!--热卖推荐Recommend-->
            <div class="recommend"></div>
        </article>
    </section>
</body>
</html>
<script src="js/pro_details.js"></script>